<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('发运订单')"/>
    <th:block th:include="include :: bootstrap-fileinput-css"/>
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <div class="row">
        <div class="col-sm-12 select-table table-striped">
            <input type="hidden" id="id" name="id" th:value="${id}">
            <table id="bootstrap-table" data-detail-view="true"></table>
        </div>
    </div>
</div>
<div class="row">
    <div class="col-sm-offset-5 col-sm-10">
        <button type="button" class="btn btn-sm btn-primary" onclick="submitHandler()"><i class="fa fa-check"></i>发 运</button>&nbsp;
        <button type="button" class="btn btn-sm btn-danger" onclick="closeItem()"><i class="fa fa-reply-all"></i>关 闭 </button>
    </div>
</div>
<th:block th:include="include :: footer"/>
<th:block th:include="include :: bootstrap-fileinput-js"/>
<script th:inline="javascript">

    function submitHandler() {
        var id = $("#id").val();
        table.set();
        $.modal.confirm("确认信息无误！", function() {
            var url = prefix + "/updateOrderType";
            var data = {"ids": id};
            $.operate.submit(url, "post", "json", data);
            setTimeout( function(){
                // window.location.reload();
                closeItem();
                var parent = activeWindow();//关闭并调用父窗口刷新方法
                parent.fatherReload();
            }, 500 );
        })

    }

    var prefix = ctx + "system/order"
    var prefix2 = ctx + "system/transfer"
    var datasPay = [[${@dict.getType('pay_type')}]];
    var datasType = [[${@dict.getType('order_type')}]];
    var renewFlag = [[${@permission.hasPermi('system:order:renew')}]];
    var addFlag = [[${@permission.hasPermi('system:transfer:add')}]];
    var editFlag = [[${@permission.hasPermi('system:transfer:edit')}]];
    var removeFlag = [[${@permission.hasPermi('system:transfer:remove')}]];

    $(function () {
        var options = {
            data: [[${orderList}]],
            renewUrl: prefix + "/renew/{id}",
            createUrl: prefix2 + "/add/{id}",
            updateUrl: prefix2 + "/edit/{id}",
            removeUrl: prefix2 + "/remove",
            editUrl : prefix + "/transport/{id}",
            id: "bootstrap-table",
            code: "id",
            modalName: "运单",
            showSearch: false,
            showRefresh: false,
            showToggle: false,
            showColumns: false,
            detailView: true,
            rowStyle: function(row, index) {
                return  { css:{ "background-color":'rgb(225,224,224)'}};
            },
            // rowStyle: function(row, index) {
            //     return  { css:{ "background-color":'rgba(238,231,231,0.87)'}};
            //     if(index % 2 != 0){
            //     }
            //     return  { css:{ "background-color":'rgb(255,255,255)'}};
            // },
            onExpandRow : function(index, row, $detail) {
                initChildTable(index, row, $detail);
            },
            onPostBody(data) {
                expand(data);
            },
            columns: [
                { field: 'createUser', title: '建单人', },
                { field: 'id', title: '主键',  visible: false },
                { field: 'vehicleInspector',  title: '提验人', },
                { field: 'userName', title: '业务员', },
                { field: 'client',  title: '委托人', },
                { field: 'clientPhone', title: '委托人电话', },
                { field: 'vehicleModel', title: '车型', },
                { field: 'vin', title: '车架号', },
                { field: 'origin', title: '起始地', },
                { field: 'dest', title: '目的地',  },
                { field: 'receiverPhone', title: '接车人电话', },
                { field: 'freightAmount',  title: '运费金额', },
                { field: 'paidAmount',  title: '预付款', },
                { field: 'payType', title: '支付方式', align: 'center',
                    formatter: function (value, row, index) {
                        return $.table.selectDictLabel(datasPay, row.payType);
                    }
                },
                { field: 'orderType', title: '订单状态', align: 'center',
                    formatter: function (value, row, index) {
                        return $.table.selectDictLabel(datasType, value);
                    }
                },
                { field: 'createTime', title: '建单时间', },
                { field: 'notes', title: '备注', },
                { title: '操作', align: 'center',
                    formatter: function (value, row, index) {
                        var actions = [];
                        actions.push('<a class="btn btn-info btn-xs" href="javascript:void(0)" onclick="addOrderT(\'' + row.id + '\')"><i class="fa fa-plus"></i>添加中转</a> ');
                        // actions.push('<a class="btn btn-info btn-xs ' + addFlag + '" href="javascript:void(0)" onclick="$.operate.add(\'' + row.id + '\')"><i class="fa fa-plus"></i>添加中转</a> ');
                        actions.push('<a class="btn btn-success btn-xs ' + renewFlag + '" href="javascript:void(0)" onclick="$.operate.renewFull(\'' + row.id + '\')"><i class="fa fa-edit"></i>详单</a> ');
                        actions.push('<a class="btn btn-danger btn-xs" href="javascript:void(0)" onclick="removeOrder(\'' + row.id + '\')"><i class="fa fa-remove"></i>删除</a>');
                        return actions.join('');
                    }
                }]
        };
        $.table.init(options);
    });

    function addOrderT(id) {
        table.set();
        var url = prefix2 + "/addOrderT";
        var data = { "orderId": id };
        $.operate.submit(url, "post", "json", data);
        setTimeout( function(){
            var tId = "bootstrap-table-son"+id;
            $("#"+tId).bootstrapTable('refresh', {
                silent: true,
                url: prefix + "/transferList",
            });
        }, 200 );
    }

    function removeOrder(id){
        var ids = $("#id").val();
        let arr = ids.split(",");
        arr = arr.filter(item => item != id);
        // table.set();
        // var url = table.options.editUrl.replace("{id}", arr);
        // $.modal.openTab("批量发运" + table.options.modalName, url);
        $.modal.confirm("确认要删除吗？", function() {
            table.set();
            var url = table.options.editUrl.replace("{id}", arr);
            $.modal.openTab("批量发运" + table.options.modalName, url);
            // setTimeout(function(){
            //     var parent = activeWindow();//关闭并调用父窗口刷新方法
            //     parent.close();
            // }, 500 );
        });
    }
    function close(){
        closeItem();
    }
    function expand (data){
        $("#bootstrap-table").bootstrapTable('expandAllRows', data);
    }

    initChildTable = function(index, row, $detail) {
        var oId = row.id;
        var tId = "bootstrap-table-son"+row.id;
        var childTable = $detail.html('<table id="'+tId+'" style="table-layout:fixed"></table>').find('table');
        $(childTable).bootstrapTable({
            url: prefix + "/transferList",
            method: 'post',
            sidePagination: "server",
            contentType: "application/x-www-form-urlencoded",
            queryParams : {
                orderId: row.id
            },
            columns: [{ title: "序号", align: "center",
                formatter: function (value, row, index) {
                    return $.table.serialNumber(index);
                }
            },
            { field: 'name', align: 'center', title: '中转地', 
                formatter: function(value, row, index) {
                    if(value == null){
                        value = "";
                    }
                    var name = "name"+row.id;
                    var html = $.common.sprintf("<input class='form-control' type='text' id='"+name+"' name='name' value='"+value+"' onblur='submitEdit("+row.id+", id)' >", index, value);
                    return html;
                }
            },
            { field: 'transitBranch', align: 'center', title: '中转人', 
                formatter: function(value, row, index) {
                    if(value == null){
                        value = "";
                    }
                    var name = "transit_branch"+row.id;
                    var html = $.common.sprintf("<input class='form-control' type='text' id='"+name+"' name='transitBranch' value='"+value+"' onblur='submitEdit("+row.id+", id)' >", index, value);
                    return html;
                }
            },
            { field: 'transferFee', align: 'center', title: '中转费', 
                formatter: function(value, row, index) {
                    if(value == null){
                        value = "";
                    }
                    var name = "transfer_fee"+row.id;
                    var html = $.common.sprintf("<input class='form-control' type='text' name='transferFee' id='"+name+"' value='"+value+"' onblur='submitEdit("+row.id+", id)' >", index, value);
                    return html;
                }
            },
            // { field: 'owes', align: 'center', title: '欠/返',
            //     formatter: function(value, row, index) {
            //         var html = $.common.sprintf("<input class='form-control' type='text' name='owes' id='owes' value='"+value+"' onblur='submitEdit("+row.id+", id)' >", index, value);
            //         return html;
            //     }
            // },
            { field: 'amount',  align: 'center', title: '到收款', 
                formatter: function(value, row, index) {
                    var name = "amount"+row.id;
                    var html = $.common.sprintf("<input class='form-control' type='number' name='amount' id='"+name+"' value='"+value+"' onblur='submitEdit("+row.id+", id)' >", index, value);
                    return html;
                }
            },
            { field: 'plateNumber', align: 'center', title: '车牌号', 
                formatter: function(value, row, index) {
                    if(value == null){
                        value = "";
                    }
                    var name = "plate_number"+row.id;
                    var html = $.common.sprintf("<input class='form-control' type='text' name='plateNumber' id='"+name+"' value='"+value+"' onblur='submitEdit("+row.id+", id)' >", index, value);
                    return html;
                }
            },
            { field: 'transporter',  align: 'center',  title: '驾驶员', 
                formatter: function(value, row, index) {
                    if(value == null){
                        value = "";
                    }
                    var name = "transporter"+row.id;
                    var html = $.common.sprintf("<input class='form-control' type='text' name='transporter' id='"+name+"' value='"+value+"' onblur='submitEdit("+row.id+", id)' >", index, value);
                    return html;
                }
            },

            { field: 'transporterPhone', align: 'center', title: '驾驶员电话', 
                formatter: function(value, row, index) {
                    if(value == null){
                        value = "";
                    }
                    var name = "transporter_phone"+row.id;
                    var html = $.common.sprintf("<input class='form-control' type='text' name='transporterPhone' id='"+name+"' value='"+value+"' onblur='submitEdit("+row.id+", id)' >", index, value);
                    return html;
                }
            },
            { field: 'notes',  align: 'center', title: '备注', 
                formatter: function(value, row, index) {
                    if(value == null){
                        value = "";
                    }
                    var name = "notes"+row.id;
                    var html = $.common.sprintf("<input class='form-control' type='text' name='notes' id='"+name+"' value='"+value+"' onblur='submitEdit("+row.id+", id)' >", index, value);
                    return html;
                }
            },
            {
                title: '操作',
                align: 'center',
                formatter: function (value, row, index) {
                    var actions = [];
                    // actions.push('<a class="btn btn-success btn-xs ' + editFlag + '" href="javascript:void(0)" onclick="edit(\'' + row.id + '\')"><i class="fa fa-edit"></i>确认</a> ');
                    actions.push('<a class="btn btn-danger btn-xs ' + removeFlag + '" href="javascript:void(0)" onclick="remove(\'' + row.id + '\', \'' + oId + '\')"><i class="fa fa-remove"></i>删除</a>');
                    return actions.join('');
                }
            }]
        });
    };

    function submitEdit(id, tName){
        table.set();
        var tValue = $("#"+tName).val();
        var url = ctx + "system/transfer/updateOrderTransfer";
        var data = { "id": id, "tName": tName, "tValue":tValue };
        submit(url, "post", "json", data);

    }

    function submit(url, type, dataType, data) {
        var config = {
            url: url,
            type: type,
            dataType: dataType,
            data: data,
            success: function(result) {
            }
        };
        $.ajax(config)
    }
    function remove(id, oId) {
        table.set();
        $.modal.confirm("确定删除该条信息吗？", function() {
            var url = prefix2 + "/remove";
            var data = { "ids": id };
            $.operate.submit(url, "post", "json", data);
            setTimeout( function(){
                var tId = "bootstrap-table-son"+oId;
                $("#"+tId).bootstrapTable('refresh', {
                    silent: true,
                    url: prefix + "/transferList",
                });
            }, 200 );
        });
    }
    function reload() {
        window.location.reload();
    }
</script>
</body>
</html>